.category-container {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 13px;
  &__item {
    height: 28px;
    background: #f4fafd;
    border: 1px solid #0099ff0f;
    border-radius: 8px;
    padding: 4px 8px;
    margin-right: 16px;
    margin-bottom: 16px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer;
    &:hover {
      background: #dbecfa;
    }
    &--active {
      background: #0099ff !important;
      .category-container__item--category {
        color: #fff !important;
      }
    }
    &--category {
      font-family: PingFangSC-Medium;
      font-weight: 500;
      font-size: 14px;
      display: inline-block;
      color: #000000d9;
    }
    &--icon {
      display: inline-block;
      margin-right: 8px;
      width: 20px;
      height: 20px;
    }
    &:last-child {
      margin-right: 0px;
    }
  }
}
